<template>
	<view class="layout">
		<view class="block_st">
			<navigator>
				<button class="button" hover-class="act">个人信息</button>
			</navigator>
			<navigator>
				<button class="button" hover-class="act">地址管理</button>
			</navigator>
			<navigator>
				<button class="button" hover-class="act">账户安全</button>
			</navigator>
			<navigator>
				<button class="button" hover-class="act">认证信息</button>
			</navigator>
			<navigator>
				<button class="button" hover-class="act">退出登录</button>
			</navigator>
		</view>
	</view>
</template>

<script setup>

</script>

<style lang="scss" scoped>
.layout{
	.block_st{
		navigator{
			margin: auto;
			width: 88%;
			background: white;
			border-radius: 8px;
		}
		.line{
			margin: auto;
			width: 88%;
			height: 2px;
			display: flex;
			flex-direction: row;
			justify-content: center;/*设置居中*/
			background-color: #000;
		}
		.button{
			padding: 10px;
			margin: 25px 0px;
			width: 100%;
			height: 65px;
			background: white;
			border-radius: 8px;
			text-align: center;
			box-shadow: 2px 2px 1px #ccc;
			transition: background 0.1s ease;
		}
		.act{
			padding: 10px;
			width: 100%;
			height: 65px;
			background: #256;
			border-radius: 8px;
			box-shadow: 2px 2px 1px #256;
			transition: background, box-shadow 0.2s ease;
		}
	}
}
</style>